/** Add css rules here for your application. */


/** Example rules used by the template application (remove for your app) */
h1 {
  font-size: 2em;
  font-weight: bold;
  color: #777777;
  margin: 40px 0px 70px;
  text-align: center;
}

.sendButton {
  display: block;
  font-size: 16pt;
}

/** Most GWT widgets already have a style name defined */
.gwt-DialogBox {
  width: 400px;
}

.dialogVPanel {
  margin: 5px;
}

.serverResponseLabelError {
  color: red;
}

/** Set ids using widget.getElement().setId("idOfElement") */
#closeButton {
  margin: 15px 6px 6px;
}

body
{
	background:#c5ccd3 url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/stripes.png);
	font-family:Helvetica;
	-webkit-user-select:none;
	-webkit-text-size-adjust:none;
	margin:0 0 0 10px;
	padding:0;
}

div#header + h1,ul + h1
{
	color:#4c566c;
	font:bold 18px Helvetica;
	text-shadow:#fff 0 1px 0;
	margin:15px 0 0 10px;
}

ul + p,ul.data + p + p,ul.form + p + p
{
	color:#4c566c;
	font:14px Helvetica;
	text-align:center;
	text-shadow:#FFF 0 1px 0;
	margin:0 10px 17px 0;
}

div#header
{
	background:#6de056 url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/bgHeader.png) repeat-x top;
	border-top:1px solid #cdd5df;
	border-bottom:1px solid #2e3744;
	min-height:44px;
	-webkit-box-sizing:border-box;
	margin:0 0 0 -10px;
	padding:10px;
}

div#header h1
{
	color:#fff;
	font:bold 20px/30px Helvetica;
	text-shadow:#2d3642 0 -1px 0;
	text-align:center;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
	width:49%;
	position:absolute;
	top:0;
	left:50%;
	margin:2px 0 0 -24%;
	padding:5px 0;
}

div#header a
{
	color:#FFF;
	background:none;
	font:bold 12px/30px Helvetica;
	width:auto;
	height:30px;
	text-shadow:#2e3744 0 -1px 0;
	text-overflow:ellipsis;
	text-decoration:none;
	white-space:nowrap;
	position:absolute;
	overflow:hidden;
	top:7px;
	right:6px;
	/**-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/toolButton.png) 0 5 0 5;**/
	border-width:0 5px;
	margin:0;
	padding:0 3px;
}

div#header #backButton
{
	left:6px;
	right:auto;
	max-width:55px;
	/**-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/backButton.png) 0 8 0 14;**/
	border-width:0 8px 0 14px;
	padding:0;
}

.Action
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/actionButton.png) 0 5 0 5;
	border-width:0 5px;
}

div#header ul
{
	margin-top:15px;
}

div#header p
{
	color:#3c4650;
	font-weight:700;
	font-size:13px;
	text-align:center;
	clear:both;
	position:absolute;
	top:4px;
	left:35px;
	right:35px;
	text-shadow:#C0CBDB 0 1px 0;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
	margin:0;
}

div.pre
{
	height:60px;
}

div.pre h1
{
	top:18px!important;
}

div.pre a
{
	top:25px!important;
	right:6px;
}

div.pre a#Backbutton
{
	left:6px!important;
}

ul
{
	color:#000;
	background:#fff;
	border:1px solid #B4B4B4;
	font:bold 17px Helvetica;
	-webkit-border-radius:8px;
	margin:15px 10px 17px 0;
	padding:0;
}

ul li
{
	color:#666;
	border-top:1px solid #B4B4B4;
	list-style-type:none;
	padding:10px;
}

li:first-child
{
	border-top:0;
	-webkit-border-top-left-radius:8px;
	-webkit-border-top-right-radius:8px;
}

li:last-child
{
	-webkit-border-bottom-left-radius:8px;
	-webkit-border-bottom-right-radius:8px;
}

ul li.arrow
{
	background-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chevron.png);
	background-position:right center;
	background-repeat:no-repeat;
}

a.ads:visited
{
	color:grey;
}

#plastic ul li.arrow,#metal ul li.arrow
{
	background-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chevron_dg.png);
	background-position:right center;
	background-repeat:no-repeat;
}

ul li a,li.img a + a
{
	color:#000;
	text-decoration:none;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
	display:block;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	margin:-10px;
	padding: 12px 10px;
}

ul li.img a + a
{
	font-size:17px;
	font-weight:700;
	margin:-10px 10px -20px 10px;
}

ul li.img a + a + a
{
	font-size:14px;
	font-weight:400;
	margin-left:-10px;
	margin-bottom:-10px;
	margin-top:0;
}

ul li.img a + small + a
{
	margin-left:-5px;
}

ul li.img a + small + a + a
{
	margin-left:-10px;
	margin-top:-20px;
	margin-bottom:-10px;
	font-size:14px;
	font-weight:400;
}

ul li.img a + small + a + a + a
{
	margin-left:0!important;
	margin-bottom:0;
}

ul li a + a
{
	color:#000;
	font:14px Helvetica;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
	display:block;
	margin:0;
	padding:0;
}

ul li a + a + a,ul li.img a + a + a + a,ul li.img a + small + a + a + a
{
	color:#666;
	font:13px Helvetica;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
	display:block;
	margin:0;
	padding:0;
}

ul li small
{
	color:#369;
	font:17px Helvetica;
	text-align:right;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
	display:block;
	width:23%;
	float:right;
	padding:3px 0;
}

ul li.arrow small
{
	padding:0 15px;
}

ul li small.counter
{
	font-size:15px!important;
	line-height:13px!important;
	font-weight:600;
	background: #eee;
	color:#777;
	-webkit-border-radius:11px;
	display:inline!important;
	width:auto;
	margin-top:25px;
	padding:4px 10px 5px;
}

ul li.arrow small.counter
{
	margin-right:15px;
}

ul li.arrow a
{
	width:95%;
}

ul li small + a
{
	width:75%;
}

ul li.arrow small + a
{
	width:70%;
}

ul li.img
{
	padding-left:70px;
}

ul li.img a.img
{
	background:url(http://pic.classistatic.com/image/pics/classifieds/en-CA/imageplaceholder10-gs.gif) no-repeat;
	background-position:center center;
	display:inline-block;
	width:75px;
	height:30px;
	float:left;
	margin:-5px 0 -20px -75px;
}

ul.individual
{
	border:0;
	background:none;
	clear:both;
	height:45px;
}

ul.individual li
{
	color:#b7becd;
	background:#FFF;
	border:1px solid #b4b4b4;
	font-size:14px;
	text-align:center;
	-webkit-border-radius:8px;
	-webkit-box-sizing:border-box;
	width:48%;
	float:left;
	display:block;
	padding:11px 10px 14px;
}

ul.individual li a
{
	color:#324f85;
	line-height:16px;
	-webkit-border-radius:8px;
	margin:-11px -10px -14px;
	padding:11px 10px 14px;
}

ul.individual li a:hover
{
	color:#fff;
	background:#36c;
}

#sticky
{
	margin-left:-10px;
}

body#normal h4
{
	color:#fff;
	background:#9a9faa url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/bglight.png) top left repeat-x;
	border-top:1px solid #a5b1ba;
	text-shadow:#666 0 1px 0;
	margin:0;
	padding:2px 10px;
}

h4.sticky
{
	color:#fff;
	background:#9a9faa url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/bglight.png) top left repeat-x;
	border-top:1px solid #a5b1ba;
	text-shadow:#666 0 1px 0;
	text-align:center;
	margin:0;
	padding:2px 10px;
}

div.blank
{
	color:#fff;
	background:#9a9faa url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/bglight.png) top left repeat-x;
	border-top:1px solid #a5b1ba;
	margin:0;
	padding:2px 10px;
}

body#normal,body#metal
{
	background-color:#fff;
	margin:0;
	padding:0;
}

body#normal ul,body#metal ul,body#plastic ul
{
	-webkit-border-radius:0;
	border-left:0;
	border-right:0;
	border-top:0;
	margin:0;
}

body#metal ul
{
	border-top:0;
	border-bottom:0;
	background:#b4b4b4;
}

body#normal ul li
{
	font-size:20px;
}

body#normal ul li small
{
	font-size:16px;
	line-height:28px;
}

body#normal li,body#metal li
{
	-webkit-border-radius:0;
}

body#normal li em
{
	font-weight:400;
	font-style:normal;
}

body#normal h4 + ul
{
	border-top:1px solid #989ea4;
	border-bottom:1px solid #717d85;
}

body#metal ul li
{
	border-top:1px solid #eee;
	border-bottom:1px solid #9c9ea5;
	background:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/bgMetal.png) top left repeat-x;
	font-size:26px;
	text-shadow:#fff 0 1px 0;
}

body#metal ul li a
{
	line-height:26px;
	margin:0;
	padding:13px 0;
}

body#metal ul li a:hover
{
	color:#000;
}

body#metal ul li:hover small
{
	color:inherit;
}

body#metal ul li a em
{
	display:block;
	font-size:14px;
	font-style:normal;
	color:#444;
	width:50%;
	line-height:14px;
}

body#metal ul li small
{
	float:right;
	position:relative;
	margin-top:10px;
	font-weight:700;
}

body#metal ul li.arrow a small
{
	padding-right:0;
	line-height:17px;
}

body#metal ul li.arrow
{
	background:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/bgMetal.png) top left repeat-x, url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chevron_dg.png) right center no-repeat;
}

div#optionpanel
{
	background:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/blackbg.png) top left repeat-x;
	text-align:center;
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	padding:20px 10px 15px;
}

div#optionpanel h2
{
	font-size:17px;
	color:#fff;
	text-shadow:#000 0 1px 0;
}

.button
{
	color:#fff;
	font:bold 20px/46px Helvetica;
	text-decoration:none;
	text-align:center;
	text-shadow:#000 0 1px 0;
	display:block;
	border-width:0 14px;
	margin:3px 0;
}

.green
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/greenButton.png) 0 14 0 14;
}

.red
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/redButton.png) 0 14 0 14;
}

.white
{
	color:#000;
	text-shadow:#fff 0 1px 0;
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/whiteButton.png) 0 14 0 14;
}

.black
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/grayButton.png) 0 14 0 14;
}

ul.form li
{
	padding:7px 10px;
}

ul.form li.error
{
	border:2px solid red;
}

ul.form li.error + li.error
{
	border-top:0;
}

ul li input[type=text],ul li input[type=password],ul li input[type=email],ul li textarea,ul li select
{
	color:#777;
	background:#fff url(http://pic.classistatic.com/image/site/ca/mobile/r4//.png);
	border:0;
	font:normal 17px Helvetica;
	display:inline-block;
	margin-left:0;
	width:100%;
	-webkit-appearance:textarea;
	padding:0;
}

ul li textarea
{
	height:120px;
	text-indent:-2px;
	padding:0;
}

ul li select
{
	text-indent:0;
	background:transparent url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chevron.png) no-repeat 103% 3px;
	-webkit-appearance:textfield;
	margin-left:0px;
	width:100%;
}

ul li input[type=checkbox],ul li input[type=radio]
{
	color:#324f85;
	margin:0px;
	padding:10px;
}

ul li input[type=checkbox]:after,ul li input[type=radio]:after
{
	content:attr(title);
	font:17px Helvetica;
	display:block;
	width:246px;
	margin:-12px 0 0 17px;
}

ul.data li h4
{
	margin:10px 0 5px;
}

ul.data li p
{
	text-align:left;
	font-size:14px;
	line-height:18px;
	font-weight:400;
	margin:0;
}

ul.data li p + p
{
	margin-top:10px;
}

ul.data li
{
	background:none;
	color:#222;
	padding:15px 10px;
}

ul.data li a
{
	display:inline;
	color:#2E3744;
	text-decoration:underline;
}

ul.field li small
{
	position:absolute;
	right:25px;
	margin-top:3px;
	z-index:3;
	font-size:13px;
	font-weight:700;
}

ul.field li h3
{
	color:#4c566c;
	width:25%;
	font-size:13px;
	line-height:18px;
	float:left;
	text-align:right;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	margin:0 10px 0 0;
	padding:0;
}

ul.field li a
{
	font-size:13px;
	line-height:18px;
	overflow:visible;
	white-space:normal;
	display:inline-block;
	width:60%;
	vertical-align:top;
	margin:0;
	padding:0;
}

ul.field li big
{
	font-size:13px;
	line-height:18px;
	font-weight:400;
	overflow:visible;
	white-space:normal;
	display:inline-block;
	width:60%;
}

ul.profile
{
	border:0;
	background:none;
	clear:both;
	min-height:62px;
	position:relative;
}

ul.profile li
{
	background:#fff url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/profile-user.png) no-repeat;
	border:1px solid #B4B4B4;
	width:62px;
	height:62px;
	-webkit-border-radius:4px;
	-webkit-box-sizing:border-box;
	float:left;
}

ul.profile li + li
{
	border:0;
	background:none;
	width:70%;
}

ul.profile li + li h2,ul.profile li + li p
{
	color:#2e3744;
	text-shadow:#fff 0 1px 0;
	margin:0;
}

ul.profile li + li h2
{
	font:bold 18px/22px Helvetica;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
}

ul.profile li + li p
{
	font:14px/18px Helvetica;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
}

ul.profile li a
{
	display:block;
	width:62px;
	height:62px;
	color:transparent;
}

body#plastic
{
	background:#adadad;
	margin:0;
	padding:0;
}

body#plastic ul
{
	-webkit-border-radius:0;
	border-left:0;
	border-right:0;
	border-top:0;
	background-color:#adadad;
	margin:0;
}

body#plastic ul li
{
	-webkit-border-radius:0;
	border-top:1px solid #bfbfbf;
	border-bottom:1px solid #9d9d9d;
}

body#plastic ul li:nth-child(odd)
{
	background-color:#989898;
	border-top:1px solid #b5b5b5;
	border-bottom:1px solid #8a8a8a;
}

body#plastic ul + p
{
	font-size:11px;
	color:#2f3237;
	text-shadow:none;
	padding:10px;
}

body#plastic ul + p strong
{
	font-size:14px;
	line-height:18px;
	text-shadow:#fff 0 1px 0;
}

body#plastic ul li a
{
	text-shadow:#d3d3d3 0 1px 0;
}

body#plastic ul li:nth-child(odd) a
{
	text-shadow:#bfbfbf 0 1px 0;
}

body#plastic ul li small
{
	color:#3C3C3C;
	text-shadow:#d3d3d3 0 1px 0;
	font-size:13px;
	font-weight:700;
	text-transform:uppercase;
	line-height:24px;
}

#plastic ul.minibanner,#plastic ul.bigbanner
{
	border:0;
	height:81px;
	clear:both;
	margin:10px;
}

#plastic ul.bigbanner
{
	height:140px!important;
}

#plastic ul.minibanner li
{
	border:1px solid #8a8a8a;
	background-color:#989898;
	width:145px;
	height:81px;
	float:left;
	-webkit-border-radius:5px;
	padding:0;
}

#plastic ul.bigbanner li
{
	border:1px solid #8a8a8a;
	background-color:#989898;
	width:296px;
	height:140px;
	float:left;
	-webkit-border-radius:5px;
	margin-bottom:4px;
	padding:0;
}

#plastic ul.minibanner li:first-child
{
	margin-right:6px;
}

#plastic ul.minibanner li a
{
	color:transparent;
	text-shadow:none;
	display:block;
	width:145px;
	height:81px;
}

#plastic ul.bigbanner li a
{
	color:transparent;
	text-shadow:none;
	display:block;
	width:296px;
	height:145px;
}

body#chat
{
	background:#DBE1ED;
}

body#chat div.bubble
{
	width:80%;
	clear:both;
	margin:10px 10px 0 0;
}

body#chat div.left
{
	float:left;
}

body#chat div.right p
{
	border-width:10px 20px 12px 10px;
}

body#chat div.left p
{
	border-width:10px 10px 12px 20px;
}

body#chat div.left p.lime
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_lime_l.png) 10 10 13 19;
}

body#chat div.left p.lemon
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_lemon_l.png) 10 10 13 19;
}

body#chat div.left p.orange
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_orange_l.png) 10 10 13 19;
}

body#chat div.left p.aqua
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_aqua_l.png) 10 10 13 19;
}

body#chat div.left p.purple
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_purple_l.png) 10 10 13 19;
}

body#chat div.left p.pink
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_pink_l.png) 10 10 13 19;
}

body#chat div.left p.graphite
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_graphite_l.png) 10 10 13 19;
}

body#chat div.left p.clear
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_clear_l.png) 10 10 13 19;
}

body#chat div.right p.aqua
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_aqua_r.png) 10 19 13 10;
}

body#chat div.right p.lemon
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_lemon_r.png) 10 19 13 10;
}

body#chat div.right p.lime
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_lime_r.png) 10 19 13 10;
}

body#chat div.right p.purple
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_purple_r.png) 10 19 13 10;
}

body#chat div.right p.pink
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_pink_r.png) 10 19 13 10;
}

body#chat div.right p.graphite
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_graphite_r.png) 10 19 13 10;
}

body#chat div.right p.clear
{
	-webkit-border-image:url(http://pic.classistatic.com/image/site/ca/mobile/r4//images/chat_bubbles_clear_r.png) 10 19 13 10;
}

body#chat div.bubble p
{
	color:#000;
	font-size:16px;
	margin:0;
}

body#chat div.bubble + p
{
	color:#666;
	text-align:center;
	font-size:12px;
	font-weight:700;
	clear:both;
	margin:0;
	padding:10px 0 0;
}

ul.images
{
	border:0;
	-webkit-border-radius:0;
	margin:4px 4px 4px 0;
}

ul.images li
{
	border:0px solid #C0D5DD;
	-webkit-border-radius:0;
	width:170px;
	height:170px;
	float:left;
	background:url(http://pic.classistatic.com/image/pics/classifieds/en-CA/imageplaceholder10-gs.gif) no-repeat center center;
	margin:10px;
	padding:0;
}

ul.images li a:after 
{ 
	color: #333;
	padding: 4px; font-size: 10pt; padding-top: 100px;
	background: #fff; content: attr(title);
}

ul.images li a
{
	display:block;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
}

body#blank p
{
	color:#898989;
	text-align:center;
	margin:250px 0 0;
}

ul li a img.ico,ul li img.ico
{
	float:left;
	display:block;
	margin:-4px 10px -4px -1px;
}

#search
{
	border: 1px solid orange; 
	-webkit-border-radius: 4px; 
	width: 100%; 
	padding: 3px
}

#searchicon
{
	float: right; 
	position: absolute; 
	right: 15px; 
	margin: -3px 2px
}

#searchicon2
{
	float: right; 
	position: absolute; 
	right: 10px; 
	margin: -7px 1px
}

ul.individual li + li,body#chat div.right
{
	float:right;
}

ul.form li:hover,body#blank
{
	background:#fff;
}
ul.field li span.attr {
			font-size: 13px;
			line-height: 18px;
			overflow: visible;
			white-space: normal;
			display: inline-block;
			width: 60%;
			vertical-align: top;
			margin: 0;
			padding: 0;
			color: black;
			text-decoration: none;
			text-overflow: ellipsis;
			}